<template>
  <!-- ref绑定子组件-->
<div class="wrapper" ref="wrapper">
  <div class = content>
    <slot></slot>
  </div>
</div>
</template>

<script>
  import BScroll from 'better-scroll'
    export default {
        name: "Scroll",
      data(){
          return{
          scroll:null
          }
      },
      props:{
          probeType:{
            type:Number,
            default:0
          },
        pullUpLoad:{
          type:Boolean,
          default:false
        }
      },
      mounted() {
          //1创建对象
          this.scroll =new BScroll(this.$refs.wrapper,{
            click:true,
            probeType: this.probeType,
            pullUpLoad:this.pullUpLoad
          })
        //2监听滚动的位置
        this.scroll.on('scroll',(position)=>{
          this.$emit('scroll',position)
        })

        this.scroll.refresh()

        if(this.pullUpLoad){
          //3监听上拉事件
          this.scroll.on('pullingUp',()=>{
            this.$emit('pullingUp')
          })
        }
      },
      methods:{
          scrollTo(x,y,time=300){
            this.scroll && this.scroll.scrollTo(x,y,time)
          },
        finishPullUp(){
          this.scroll.finishPullUp()
        },
        refresh(){
          this.scroll && this.scroll.refresh()
        },
        getScrollY(){
            return this.scroll ? this.scroll.y:0
        }
      }
    }
</script>

<style scoped>

</style>
